<template>
  <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
    <van-swipe-item v-for="obj in imglist" :key="obj.bannerid">
      <img :src="obj.img">
    </van-swipe-item>
  </van-swipe>
</template>

<script scoped>

import axios from 'axios'
export default {
  name: 'Banner',
  data() {
    return {
      imgs: []  //将图片路径放在一个数组里面
    }
  },
  created() {
    axios({
      url: 'banner/list'
    })
      .then((res) => {
        let data = res.data;
        if (data.code == 200) {
          this.imgs = data.data
        }
      })
  },
  computed: {
    imglist: function () {
      return this.imgs.filter(item => item.flag)
    }
  }

};
</script>

<style scoped>
.my-swipe {
  margin: .425rem;
  border-radius: .625rem;

}

.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  text-align: center;

}

.my-swipe .van-swipe-item img {
  width: 100%;
  height: 100%;
}
</style>